<template>
  <div class="container">
    <!--阿里云播放器-->
    <ali-player v-if="auth !== null"
                :encryptType="1"
                :vid="id"
                :playauth="auth"
                ref="player"
                :useFlashPrism="false"
                :autoplay="true"
                :isLive="false"
                :showBuffer="true"
                :cover="cover"
                :showBarTime="true"
                :disableSeek="true"
                showBarTime="500"
                width="800px"
                controlBarVisibility="always">
    </ali-player>
    <el-button
      style="position: absolute; left: 20px; top: 20px;"
      icon="el-icon-back"
      @click="goBack"
      v-hasPermi="['edu:course:list']"
    >返回</el-button>
  </div>
</template>
<script>
import {getVodAuth} from "@/api/edu/video";
import VueAliplayer from "../../components/vod/player";

export default {
  components: {"ali-player": VueAliplayer},

  data() {
    return {
      // 视频id
      id: null,
      // 视频播放凭证
      auth: null,
      // 封面
      cover: ''
    }
  },
  created() {
    this.id = this.$route.params.id;
    this.getAuth();
  },
  methods: {
    getAuth() {
      getVodAuth(this.id).then(res => {
        this.auth = res.msg
      })
    },
    goBack() {
      this.$router.back()
    }
  }
}
</script>
<style>
.container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>
